1、首先要导入相应的css和js:
<link href="../static/css/bootstrap.min.css" rel="stylesheet" />
<link href="../static/css/bootstrap-table.min.css" rel="stylesheet" />
<link href="../static/css/bootstrap-table-fixed-columns.css" rel="stylesheet" />
<script src="../static/jq/jquery-3.3.1.min.js"></script>
<script src="../static/js/bootstrap-table.min.js"></script>
<script src="../static/js/bootstrap-table-fixed-columns.js"></script>
<script src="../static/js/bootstrap-table-zh-CN.js"></script>
2、然后调用下面这个js方法来固定表格前4列,并设置表格的参数(这个方法bootstrap-table会根据表格的内容,自动生成一个新的表格,并会覆盖掉),data_table是要引用的表格id,后面的格式固定:
$("#data_table").bootstrapTable('destroy').bootstrapTable({
// search: true, //是否开启搜索栏
toolbar : '.toolbar', //用哪个DOM作为工具栏
//pagination : true, // 是否显示分页(*)
//sidePagination : "client", // 分页方式:client客户端分页,server服务端分页(*)
//pageNumber : 1, // 初始化加载第一页,默认第一页
//pageSize : 2, // 每页的记录行数(*)
fixedColumns : true, //是否开启固定列
fixedNumber : 4, //固定几列
height : 表格高度 //设置表格高度
});
bootstrap-table文件下载:
链接: https://pan.baidu.com/s/1Un3t...
提取码: yh2w
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。